<template>
	<view>
		<TopNav title="设备列表"></TopNav>
		<SearchMenu v-if='false' @search="handleSearch" @reset="handleReset" :sortOption="sortOption" :list="list">
			<template v-slot:search>
				<van-cell title="设备名称">
					<van-field v-model="queryParams.culturePondName" placeholder="输入设备名称查询" :border="false"
						input-align="right" class="padding-none" />
				</van-cell>
				<van-cell title="设备类型">
					<DictPicker dict="biz_device_type" v-model="queryParams.type" placeholder="请选择设备类型" :first="false">
					</DictPicker>
				</van-cell>
			</template>
		</SearchMenu>

		<view class="cu-card case">
			<view class="cu-item shadow padding" v-for="item in list" :key="item.id" @click="handleToPage('detail',item)">
				<view class=" align-center">
					<view class="shrink-0 padding-right flex justify-between">
						<view>
							<text class="text-xl text-bold text-blue" style="margin-right: 20px;">{{item.name}}</text>
							<text v-if="item.deviceStatus==='normal'" style="color: green;">在线</text>
							<text v-if="item.deviceStatus==='offline'" style="color: red;">离线</text>
							<text v-if="item.deviceStatus==='warning'" style="color: orange;">报警</text>
							<text v-if="item.deviceStatus==='preWarning'" style="color: orange;">预警</text>
						</view>
						<text v-if="item.type==='WD' && item.lastData">{{item.lastData.value}} ℃</text>
						<text v-if="item.type==='RJYND' && item.lastData">{{item.lastData.value}} ml/L</text>
						<text v-if="item.type==='RJYBHD' && item.lastData">{{item.lastData.value}} %</text>
						<text v-if="item.parentCategoryCode==='YZSB' && item.lastData">{{item.lastData.value===1?'运行中':'停止'}}</text>
					</view>
					<view v-if="item.parentCategoryCode==='YZSB' && item.lastRun" class="flex justify-between padding-top-xs">
						<view class="">
							<text class="text-gray">今日启动/运行：</text>
							<text>{{item.runCount}}/{{item.lastRun.runTimeStr}}</text>
						</view>
					</view>
					<view v-if="item.parentCategoryCode==='YZSB' && item.lastRun" class="flex justify-between padding-top-xs">
						<view class="">
							<text class="text-gray">上一次启动：</text>
							<text>{{item.lastRun.startTime}}</text>
						</view>
					</view>
					
					<view class="flex justify-between padding-top-xs">
						<view class="">
							<text class="text-gray">类型：</text>
							<text>{{item.categoryName}}</text>
						</view>
						<view class="">
							<text class="text-gray">塘口：</text>
							<text>{{item.pondList.join(',') || '-'}}</text>
						</view>
					</view>
				</view>

			</view>
		</view>
	<!-- 	<u-loadmore :status="loadStatus" @loadmore="getMoreList" v-if="list.length" />
		<van-empty description="暂无数据" v-if="!list.length" /> -->
	</view>
</template>

<script>
	import {
		getProductionBaseDeviceList
	} from '@/api/mine/productio_base/index'
	import mixins from "@/mixins"
	import DictPicker from '@/components/dict-picker/index.vue'
	export default {
		mixins: [mixins],
		components:{DictPicker},
		data() {
			return {
				sortOption: [{
						text: '日期排序',
						value: 'createTime',
						rule: 'date'
					},
					{
						text: '类型排序',
						value: 'typeName',
						rule: ['水质检测', '养殖设备' ]
					}
				],
				baseUrl: getApp().globalData.config.baseUrl,
				list: [],
				loadStatus: 'loadmore',
				queryParams: {
					startDate: '',
					endDate: '',
					type: '',
					id: undefined,
					pageSize: 10,
					pageNum: 1
				},

			};
		},
		onLoad(query){
			this.queryParams.id = this.$store.state.user.baseInfo.id
			if(query.type===undefined||query.type===null||query.type==='undefined') {
					this.queryParams.type=''
			}else{
				this.queryParams.type = query.type
			}
			this.getList()
		},
		onReachBottom() {
			if (this.loadStatus === 'nomore') return
			this.queryParams.pageNum += 1
			this.getList()
		},
		methods: {
			handleToPage(path, params) {
				switch (path) {
					case 'detail':
						this.$tab.navigateTo('./detail?id=' + params.id)
						break;
				}
			},
			getList() {
				getProductionBaseDeviceList(this.queryParams).then(res => {
					this.list = res.data
				})
			},
			getMoreList() {
				// this.queryParams.pageNum += 1
				// this.getList()
			},

			handleToDetail(obj) {
				this.$tab.navigateTo('./detail?id=' + obj.id)
			},
			handleToEdit() {
				this.$tab.navigateTo('./edit')
			},
			handleReset() {
				this.queryParams.type = ''
				this.queryParams.pageNum = 1
				this.getList()
			},
			handleSearch(query) {
				this.queryParams = {
					...this.queryParams,
					...query,
					pageNum: 1
				}
				this.getList()
			},
		}
	}
</script>

<style lang="scss" scoped>
	.text-width {
		width: 45px;
		display: inline-block;
	}
</style>